@import '../../theme';
@import '../../functions';
@import '../../mixins';
$cx-tab-link-active: 'primary';
$cx-tab-link-active-background-color: 'inverse';
$cx-tab-link-active-border: 5px solid;
ul[role='tablist'] {
  .nav-link {
    border: none;
    &.active {
      @include var-color(
        'background-color',
        $cx-tab-link-active-background-color
      );
      @include var-color('color', $cx-tab-link-active);
      border-bottom: $cx-tab-link-active-border;
      div {
        @include var-color('color', $cx-tab-link-active);
        font-weight: $font-weight-semi;
      }
    }
  }
}
